<template>
  <!-- <Tutorial/> -->
  <div>
    首页
      <!-- 
        我们这个项目用到了elementUI框架，
        这个框架主要是提供了一些布局用的组件
       -->
       <!-- 
        el-row 表示行组件  ---- elementUI提供的组件
          type=flex 表示row组件使用flex布局
          justify="space-between" 表示row组件里面的内容两端对齐
        -->
      <el-row type="flex" justify="space-between">
        <span>第一个标签</span>
        <span>第二个标签</span>
        <span>第三个标签</span>
      </el-row>
      <!-- 下拉菜单 -->
      <el-dropdown>
        <!-- 直接显示在浏览器中的内容 -->
        <span>下拉菜单</span>
        <!-- 下拉的菜单内容
          注意：el-dropdown-menu需要添加slot="dropdown" 才能够显示下拉菜单内容
         -->
        <el-dropdown-menu slot="dropdown">
          <el-dropdown-item>黄金糕</el-dropdown-item>
          <el-dropdown-item>狮子头</el-dropdown-item>
          <el-dropdown-item>螺蛳粉</el-dropdown-item>
        </el-dropdown-menu>
      </el-dropdown>
  </div>
</template>

<script>
export default {
  name: 'IndexPage'
}
</script>
